<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<head>
    <th:block th:replace="fragments/head :: public-css"/>
    <th:block th:replace="fragments/head :: bootstrap-table-css"/>
</head>

<body class="hold-transition sidebar-mini layout-fixed layout-navbar-fixed">
<!-- Site wrapper  -->
<div class="wrapper">

    <!-- 头部区域 Navbar -->
    <th:block th:replace="fragments/main-header"/>

    <!-- 左侧区域 Main Sidebar Container -->
    <th:block th:replace="fragments/main-sidebar(activeUrl='/article')"/>

    <!-- 右侧主区域 Content Wrapper. Contains page content -->
    <div class="content-wrapper  text-sm">
        <!-- 右侧导航区域 Content Header (Page header) -->
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1>文章列表</h1>
                    </div>
                    <div class="col-sm-6">
                        <ol class="breadcrumb float-sm-right">
                            <li class="breadcrumb-item"><a href="#">文章管理</a></li>
                            <li class="breadcrumb-item active">文章列表</li>
                        </ol>
                    </div>
                </div>
            </div><!-- /.container-fluid -->
        </section>
        <!-- Main content -->
        <section class="content">

            <div class="card ">
                <div class="card-header">
                    <h3 class="card-title">文章列表</h3>

                    <div class="card-tools">
                        <button sec:authorize="hasAnyAuthority('sys:article:add')" id="btn_add" type="button"
                                class="btn btn-primary"  th:onclick="location.href=[[@{/article/form}]]" data-toggle="tooltip">
                            <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>写文章
                        </button>

                        <button id="btn_batch_delete" type="button" class="btn btn-danger">
                            <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>批量删除
                        </button>

                        <button id="btn_batch_push" type="button" class="btn btn-info">
                            <span class="fa fa-send-o" aria-hidden="true"></span>批量推送
                        </button>
                    </div>
                </div>


                <div class="card-body">
                    <form class="form-inline search  text-sm" id="search-form">
                        <div class="form-group input-group-sm">
                            <label for="keywords">关键字:</label>
                            <input type="text" class="form-control m-2" id="keywords" required="">
                        </div>
                        <div class="form-group">
                            <label for="articleId">分类:</label>
                            <select id="articleId" class="form-control m-2" required="">
                                <option selected disabled>选择分类</option>
                                <option th:each="article:${categories}" th:value="${article.id}"
                                        th:text="${article.name}"></option>
                            </select>
                        </div>
                        <div class="form-group">
                            <label for="status">状态:</label>
                            <select id="status" class="form-control m-2" required="">
                                <option selected disabled>选择状态</option>
                                <option value="1">已发布</option>
                                <option value="0">草稿</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <button class="btn btn-primary ml-3" type="submit">查询</button>
                            <button class="btn btn-default ml-2" type="reset">重置</button>
                        </div>
                    </form>
                    <!-- 列表 -->
                    <table id="table" class="table table-bordered">
                    </table>
                </div>
            </div>
        </section>
    </div>

    <!--右底部区域-->
    <th:block th:replace="fragments/main-footer"/>

    <!-- 右上角工具栏 Control Sidebar -->
    <th:block th:replace="fragments/control-sidebar"/>
</div>
<th:block th:replace="fragments/script :: public-js"/>
<th:block th:replace="fragments/script :: bootstrap-table-js"/>
<th:block th:replace="fragments/script :: layer-js"/>
<script th:src="@{/modules/js/common.js}"></script>
<script th:src="@{/modules/js/article/article-list.js}"></script>
<script th:inline="javascript">
    function showOperation() {
        if (
            /*[[
            ${#authorization.expression('hasAuthority("sys:article:delete")')}
            or ${#authorization.expression('hasAuthority("sys:article:edit")')}
            ]]*/
        ) {
            $table.bootstrapTable('showColumn', 'action')
        }
    }

    function getOperationHtml(operationHtml, row) {

        if (
            /*[[${#authorization.expression('hasAuthority("sys:article:edit")')}]]*/
        ) {
            operationHtml.push('<li><a href="' + contextPath + 'article/form/' + row.id + '" class="dropdown-item btn btn-primary"><i class="fa fa-edit"></i>&nbsp;修改</a></li>')
        }

        if (
            /*[[${#authorization.expression('hasAuthority("sys:article:delete")')}]]*/
        ) {
            operationHtml.push('<li><a onclick="$.delete(\'' + contextPath + 'article/' + row.id + '\')" class="dropdown-item btn btn-primary"><i class="fa fa-trash"></i>&nbsp;删除</a></li>')
        }

    }
</script>
</body>
</html>